import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import '../../../app_files.dart';
import 'action.dart';
import 'state.dart';
import 'dart:io';

Widget buildView(
    EngineerResultViewState state, Dispatch dispatch, ViewService viewService) {
  Widget _infoWidget() => Container(
        padding: EdgeInsets.only(left: 15, right: 15, bottom: 8),
        decoration: BoxDecoration(
            color: Colors.white,
            border: Border(
                bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
        child: Column(
          children: [
            Container(
              height: 44,
              child: Align(
                alignment: Alignment.centerLeft,
                child: Text(
                  '客户信息',
                  style: TextThemeConfig.Font16WithColorBold22,
                ),
              ),
              margin: EdgeInsets.only(bottom: 4),
            ),
            Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                children: [
                  Text(
                    '客户姓名',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 50)),
                  Text(
                    state.itemModel.userName,
                    style: TextThemeConfig.Font14WithColor22,
                  ),
                ],
              ),
            ),
            Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '客户地址',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 50)),
                  Expanded(
                    child: Text(
                      state.itemModel.address,
                      style: TextThemeConfig.Font14WithColor22,
                    ),
                  ),
                ],
              ),
            ),
            state.itemModel.itemType == '5'
                ? Container()
                : Container(
                    padding: EdgeInsets.symmetric(vertical: 5),
                    child: Row(
                      children: [
                        Text(
                          '联系方式',
                          style: TextThemeConfig.Font14WithColor66,
                        ),
                        Padding(padding: EdgeInsets.only(left: 50)),
                        Text(
                          state.itemModel.phone,
                          style: TextThemeConfig.Font14WithColor22,
                        ),
                      ],
                    ),
                  ),
            state.itemModel.itemType == '6'
                ? Container(
                    padding: EdgeInsets.symmetric(vertical: 5),
                    child: Row(
                      children: [
                        Text(
                          '安装类型',
                          style: TextThemeConfig.Font14WithColor66,
                        ),
                        Padding(padding: EdgeInsets.only(left: 50)),
                        Text(
                          state.itemModel.installTypeStr,
                          style: TextThemeConfig.Font14WithColor22,
                        ),
                      ],
                    ),
                  )
                : Container(),
            state.logList.isEmpty ? Container() : Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                children: [
                  Text(
                    '首次派单时间',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 25)),
                  Text(
                    '${state.logList.first['operatetime']}',
                    style: TextThemeConfig.Font14WithColor22,
                  ),
                ],
              ),
            )
          ],
        ),
      );

  Widget _beforeContent() {
    if (state.model.beforeContent.isEmpty && (state.model.beforePhotos == null ||
        state.model.beforePhotos.length == 0)) return Container();
    return Container(
      padding: EdgeInsets.only(left: 15, right: 15, bottom: 12),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                state.itemModel.itemType == '9' ? '抢修前记录' : '安装前记录',
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Text(
            state.model.beforeContent,
            style: TextThemeConfig.Font14WithColor99,
          ),
          (state.model.beforePhotos == null ||
              state.model.beforePhotos.length == 0)
              ? Container()
              : Container(
            margin: EdgeInsets.only(top: 12, bottom: 3),
            height: 90,
            child: ListView.builder(
              itemBuilder: (BuildContext context, int index) {
                var file = state.model.beforePhotos[index];
                return InkWell(
                  child: Container(
                    margin: EdgeInsets.only(right: 12),
                    child: file is File
                        ? Image(
                      image: FileImageEx(file),
                      width: 90,
                      height: 90,
                      fit: BoxFit.fill,
                    )
                        : CustomImage(
                      file,
                      fit: BoxFit.fill,
                      width: 90,
                      height: 90,
                    ),
                  ),
                  onTap: () => dispatch(
                      EngineerResultViewActionCreator.onTapResultPic2(
                          file)),
                );
              },
              itemCount: state.model.beforePhotos.length,
              scrollDirection: Axis.horizontal,
              itemExtent: 102,
              padding: EdgeInsets.only(),
            ),
          )
        ],
      ),
    );
  }

  Widget _repairContent() => Container(
        padding: EdgeInsets.only(left: 15, right: 15, bottom: 12),
        decoration: BoxDecoration(
            color: Colors.white,
            border: Border(
                bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              height: 44,
              child: Align(
                alignment: Alignment.centerLeft,
                child: Text(
                  state.itemModel.itemType == '9' ? '抢修记录' : '安装记录',
                  style: TextThemeConfig.Font16WithColorBold22,
                ),
              ),
              margin: EdgeInsets.only(bottom: 4),
            ),
            Text(
              state.model.repairContent,
              style: TextThemeConfig.Font14WithColor99,
            ),
            (state.model.repairPhotos == null ||
                    state.model.repairPhotos.length == 0)
                ? Container()
                : Container(
                    margin: EdgeInsets.only(top: 12, bottom: 3),
                    height: 90,
                    child: ListView.builder(
                      itemBuilder: (BuildContext context, int index) {
                        var file = state.model.repairPhotos[index];
                        return InkWell(
                          child: Container(
                            margin: EdgeInsets.only(right: 12),
                            child: file is File
                                ? Image(
                                    image: FileImageEx(file),
                                    width: 90,
                                    height: 90,
                                    fit: BoxFit.fill,
                                  )
                                : CustomImage(
                                    file,
                                    fit: BoxFit.fill,
                                    width: 90,
                                    height: 90,
                                  ),
                          ),
                          onTap: () => dispatch(
                              EngineerResultViewActionCreator.onTapResultPic(
                                  file)),
                        );
                      },
                      itemCount: state.model.repairPhotos.length,
                      scrollDirection: Axis.horizontal,
                      itemExtent: 102,
                      padding: EdgeInsets.only(),
                    ),
                  )
          ],
        ),
      );

  Widget _orderPhotoWidget() {
    if (state.isDetail && state.model.orderPhoto.isEmpty) return Container();
    return Container(
      padding: EdgeInsets.only(left: 15, right: 15),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                '拍照留存',
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            margin: EdgeInsets.only(bottom: 12),
            height: 90,
            child: ListView.builder(
              itemBuilder: (BuildContext context, int index) {
                if (index == state.model.orderPhoto.length) {
                  return InkWell(
                    child: Container(
                      margin: EdgeInsets.only(right: 12),
                      width: 90,
                      height: 90,
                      color: Color(0xffF5F5F5),
                      child: Align(
                        child: Image.asset('images/icon_camera.png'),
                      ),
                    ),
                    onTap: () =>
                        dispatch(EngineerResultViewActionCreator.onTapAddPic()),
                  );
                } else {
                  var file = state.model.orderPhoto[index];
                  return InkWell(
                    child: Container(
                      margin: EdgeInsets.only(right: 12),
                      child: file is File
                          ? Image(
                              image: FileImageEx(file),
                              width: 90,
                              height: 90,
                              fit: BoxFit.fill,
                            )
                          : CustomImage(
                              file,
                              fit: BoxFit.fill,
                              width: 90,
                              height: 90,
                            ),
                    ),
                    onTap: () => dispatch(
                        EngineerResultViewActionCreator.onTapPic(file)),
                  );
                }
              },
              itemCount: state.isDetail
                  ? state.model.orderPhoto.length
                  : state.model.orderPhoto.length + 1,
              scrollDirection: Axis.horizontal,
              itemExtent: 102,
              padding: EdgeInsets.only(),
            ),
          )
        ],
      ),
    );
  }

  Widget _confirmButton() {
    if (state.isDetail) return Container();

    return Column(
      children: [
       Container(
                margin: EdgeInsets.only(left: 15, right: 15),
                height: 45,
                child: InkWell(
                  child: Center(
                    child: Text(
                      '临时上传',
                      style: TextThemeConfig.Font14WithMainColor,
                    ),
                  ),
                  onTap: () =>
                      dispatch(EngineerResultViewActionCreator.onSave()),
                ),
              ),
        Container(
          margin: EdgeInsets.only(left: 15, right: 15, top: 12, bottom: 40),
          height: 50,
          decoration: BoxDecoration(
            color: ThemeConfig.mainColor,
            borderRadius: BorderRadius.all(Radius.circular(4)),
          ),
          child: InkWell(
            child: Align(
              child: Text(
                state.model.signPhoto == null ? '确认无误去签名' : '提交工单',
                style: TextThemeConfig.Font16WithWhite,
              ),
            ),
            onTap: () =>
                dispatch(EngineerResultViewActionCreator.onSubmit(false)),
          ),
        )
      ],
    );
  }

  Widget _orderStatusWidget() {
    List<String> titles =
        state.itemModel.itemType == '9' ? ['已解决', '未解决'] : ['已安装', '未安装'];
    Widget _button(int index, String text) {
      int t = state.model.isSolve == null
          ? -1
          : state.model.isSolve
              ? 0
              : 1;
      return InkWell(
        child: Container(
          width: 80,
          height: 30,
          margin: EdgeInsets.only(right: 20, bottom: 20),
          decoration: BoxDecoration(
            color: t == index ? Color(0xffE6EEFF) : Color(0xfff5f5f5),
            borderRadius: BorderRadius.all(Radius.circular(4)),
          ),
          child: Align(
            child: Text(
              text,
              style: t == index
                  ? TextThemeConfig.Font13WithColorblue
                  : TextThemeConfig.Font13WithColor66,
            ),
          ),
        ),
        onTap: () {
          if (!state.isDetail) {
            dispatch(EngineerResultViewActionCreator.onTapStatus(index == 0));
          }
        },
      );
    }

    List<Widget> items = [];
    for (int i = 0; i < 2; ++i) {
      items.add(_button(i, titles[i]));
    }

    return Container(
      padding: EdgeInsets.only(left: 15, right: 15),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                state.itemModel.itemType == '9' ? '抢修结果' : '报装结果',
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            child: Row(
              children: state.isDetail
                  ? [
                      Padding(
                        padding: EdgeInsets.only(bottom: 12),
                        child: Text(
                          state.model.isSolve ? '已解决' : '未解决',
                          style: TextThemeConfig.Font13WithColor22,
                        ),
                      )
                    ]
                  : items,
            ),
          ),
        ],
      ),
    );
  }

  Widget _signPhotoWidget() {
    if (state.model.signPhoto == null || state.model.signPhoto.toString().isEmpty) return Container();
    return Container(
      padding: EdgeInsets.only(left: 15, right: 15),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                '电子签名',
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            margin: EdgeInsets.only(bottom: 12),
            height: 100,
            width: 175,
            child: InkWell(
              child: Container(
                margin: EdgeInsets.only(right: 12),
                child: state.model.signPhoto is File
                    ? Image(image: FileImageEx(state.model.signPhoto))
                    : CustomImage(
                        state.model.signPhoto,
                        width: 175,
                        height: 100,
                      ),
              ),
              onTap: () =>
                  dispatch(EngineerResultViewActionCreator.onTapSign()),
            ),
          )
        ],
      ),
    );
  }

  return Scaffold(
    appBar: myAppBar(viewService.context,
        title: state.isDetail ? '${state.itemModel.itemTypeStr}记录' : '客户确认'),
    body: SafeArea(
      child: ((state.isLoad && state.isDetail) || !state.isDetail)
          ? SingleChildScrollView(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  _infoWidget(),
                  _beforeContent(),
                  _repairContent(),
                  _orderStatusWidget(),
                  _orderPhotoWidget(),
                  _signPhotoWidget(),
                  _confirmButton(),
                ],
              ),
            )
          : MyLoadingWidget(),
    ),
  );
}
